


export function install ({createZDragComponentV2, createZDragTemplate, createZDragStyle, css} = {}) {
  // console.log('ZDragSDemo')
  createZDragStyle(css`
  .z-drag-demo-con {   
  }
  `)
  return createZDragComponentV2('ZDragSDemo',{
    components: {},
    template: createZDragTemplate(`
  <div class="z-drag-demo-con">
<!--  <div>测试</div>-->
  <iframe-import style="width: 100%; min-height: 450px;" :src="getSrc()" frameborder="none" allowfullscreen></iframe-import>
</div>
  `, {
      className: 'z-dragxml-com-auto'
    }),
    methods: {
      getSrc() {
        if (this.zdrag__cus_config?.ui?.widgetConfig?.src) {
          return this.zdrag__cus_config?.ui?.widgetConfig?.src
        }
        return ''
      }
    },
    data() {
      return {
        ui: {
          label: '单行iframe',
          widgetConfig: {
          }
        }
      }
    }
  }, {
    DRAG_GROUP: 'custom',
    DRAG_FIELD: true,
    DRAG_CONFIG() {
      return {
        props: {
          src: {
            type: 'string',
            ui: {
              label: '地址',
            }
          }
        }
      }
    },
    DRAG_LABEL_XML() {
      return {
        icon: `<svg t="1636083425081" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2423" width="16" height="16"><path d="M118.784 727.04h778.24V296.96h-778.24v430.08zM77.824 256h860.16v512H77.824V256zM194.56 409.6v204.8c0 12.288 8.192 20.48 20.48 20.48s20.48-8.192 20.48-20.48V409.6c0-12.288-8.192-20.48-20.48-20.48s-20.48 8.192-20.48 20.48z" p-id="2424"></path></svg>
`,
        name: 'S Demo'
      }
    },
    DRAG_EXPORT() {
      return {
        ui: {
          widget: 'CusInput'
        }
      }
    },
  })

}
